{template "content","header","mobilephone"}
<link rel="stylesheet" href="{CSS_PATH}Mobilephone/page-01ecb0fba5.min.css">
<link href="https://cdn.bootcss.com/Swiper/3.4.2/css/swiper.min.css" rel="stylesheet">
<div id="app">
    <header>
        <!-- title -->
        <section class="top-title">
            <a href="javascript:;" class="refresh" id="J_refresh"><span v-on:click="isRefresh()"></span></a>
            <a href="javascript:;" class="search"></a>
        </section>
        <!-- menu -->
        <section class="top-menu">
            <div id="topNav" class="swiper-container">
              <div class="swiper-wrapper" id="J_top_menu">
                <div class="swiper-slide active" data-type=""><span>推荐</span></div>
                {pc:content action="category" catid="0" num="25" siteid="$siteid" order="listorder ASC"}
                {loop $data $r}
                {if $r[modelid]==1}
                <div data-type="{$r[catid]}" data-url="{$r[url]}" class="swiper-slide"><span>{$r[catname]}</span></div>
                {/if}
                {/loop}
                {/pc}
              </div>
            </div>
            <div class="menu-more">
                <div class="list-shadow"></div>
                <a href="" class="more-btn"></a>
            </div>
        </section>
    </header>
    <div id="J_content" class="news-list">
        <div id="J_news_list" class="news-list-wrap" v-cloak>
            <section v-for="item in list" class="news-item" v-bind:class="{'news-item-s2':item.sizes > 2,'news-item-s1':item.sizes < 3}">
                <a :href="item.url">
                   <div class="news-wrap" v-if="item.sizes > 2">
                        <h3>{{item.title}}</h3>
                        <div class="img-wrap clearfix">
                            <div v-for="items in item.thumb" class="img fl"><img class="lazy" :src="items"></div>
                        </div>
                        <p class="tags clearfix"><em class="tag tag-time">
                            <i class="tag tag-hot">分类</i></em>
                            <em class="tag tag-src">新浪综合</em>
                            <em class="tag tag-src">{{item.updatetime | moment}}</em>
                        </p>
                    </div>
                    <div class="news-wrap clearfix" v-if="item.sizes <= 2">
                        <div class="txt-wrap fl" v-bind:class="{'txt-wrap_w':item.sizes === 0}">
                            <h3>{{item.title}}</h3>
                            <p class="tags clearfix">
                                <em class="tag tag-time">
                                    <i class="tag tag-hot">热门</i>
                                </em>
                                <em class="tag tag-src">新浪综合</em>
                                <em class="tag tag-src">{{item.updatetime | moment}}</em>
                            </p>
                        </div>
                        <div v-if="item.sizes != 0" class="img-wrap fr">
                            <img class="lazy" :src="item.thumb[0]">
                        </div>
                    </div>
                </a>
            </section>
        </div>
        <div v-if="static" id="J_loading" class="loading">
            <div class="spinner">
                <div class="bounce1"></div>
                <div class="bounce2"></div>
                <div class="bounce3"></div>
            </div>
            <p class="txt">数据加载中</p>
        </div>
    </div>
</div>
<script src="https://cdn.bootcss.com/zepto/1.2.0/zepto.min.js"></script>
<script src="https://cdn.bootcss.com/Swiper/3.4.2/js/swiper.min.js"></script>
<script src="https://cdn.bootcss.com/vue/2.4.2/vue.min.js"></script>
<script src="{JS_PATH}Mobilephone/wap_index.js?3"></script>
{template "content","footer","mobilephone"}